import {
    createSlice,
    createAsyncThunk
} from "@reduxjs/toolkit";
import { useSelector } from "react-redux";
import { getInfo, postLogin, postLogOut } from "@/api/auth";
import { message } from "antd";

const authSlice = createSlice({
    name: "auth",
    initialState: {
        loading: false,
        token: localStorage.token,
        info: {

        }
    },
    reducers: {
        changeLoading(state, action) {
            state.loading = action.payload;
        },
        upToken(state, { payload }) {
            // localStorage.setItem("token",xxx);
            // localStorage.token=xxx;
            // localStorage["token"]=xxx;
            state.token = localStorage.token = payload;
        },
        delToken(state) {
            // state.token = localStorage.token = null;
            localStorage.clear();
            state.token = null;
        },
        upInfo(state, { payload }) {
            state.info = payload;
        }
    },
    // extraReducers(builder) {
    //     builder.addCase(postLoginAsync2.fulfilled, (state, { payload }) => {
    //         // console.log("postLoginAsync2.fulfilled",payload);
    //         state.loading = false;
    //         state.token = localStorage.token = payload.result.data.token;
    //         message.success((payload as any).result.message);
    //         // payload.navigate("/");


    //     }).addCase(postLoginAsync2.pending, (state, { payload }) => {
    //         state.loading = true;
    //         // console.log("postLoginAsync2.pending",payload);
    //     }).addCase(postLoginAsync2.rejected, (state, { payload }) => {
    //         // console.log("postLoginAsync2.rejected",payload);
    //         state.loading = false;
    //     })
    // }
})
// 柯里化
export const postLoginAsync = function (options: any) {
    return async (dispatch: any, getState: any) => {
        console.log(getState())// 获取redux仓库中的数据状态
        try {
            dispatch(changeLoading(true));
            const result: any = await postLogin(options.values);
            message.success(result.message);
            dispatch(changeLoading(false));
            dispatch(upToken(result.data.token));
            options.navigate("/");
        } catch (err) {
            dispatch(changeLoading(false));
        }
    }
}
// 扩展
// export const postLoginAsync2 = createAsyncThunk("postLoginAsync2", async function (options: any) {
//     try {
//         const result = await postLogin(options.values);

//         return {
//             result,
//             // navigate:options.navigate
//         };
//     } catch (err) {
//         return Promise.reject(err);
//     }

// })
// 退出登陆
export const postLogOutAsync = function () {
    return async (dispatch: any) => {
        await postLogOut();
        dispatch(delToken());
        message.success("退出成功");

    }
}
// 获取账号信息
export const getInfoAsync = function () {
    return async (dispatch: any) => {
        const result = await getInfo();
        console.log(result);
        dispatch(upInfo({
            name: result.data.name,
            avatar: result.data.avatar
        }))
    }
}
export const { changeLoading, upToken, delToken, upInfo } = authSlice.actions;
export const useSelectorAuth = () => useSelector((state: any) => state.auth);
export default authSlice.reducer;